import { Table, Space } from "antd";
import { useEffect, useState } from "react";
import { oder } from "../../apis/user";
import Column from "antd/lib/table/Column";

type ListProps = {};

export const Order = (props: ListProps) => {
  const [data, setdata] = useState();

  const [current, setCurrent] = useState(1) // 页码
  const [pageSize, setPageSize] = useState(10) // 每页显示个数

  useEffect(() => {
    oder().then((rew) => {
      console.log((rew as any).data);
      setdata((rew as any).data);
    });
  }, []);

  return (
    <Space direction="vertical" style={{ width: "100%" }}>
      <Table 
        dataSource={data}
        pagination = {{
          position: ['bottomRight'],
          current,
          pageSize,
          onChange: (page, pageSize) => {
            setCurrent(page)
            setPageSize(pageSize)
          },
          showTotal: (total) => {
            return <span>共有{total}条数据</span>
          },
          showQuickJumper: true,
          pageSizeOptions: [5, 10, 20, 50]
        }}
      >
        <Column title="订单号" dataIndex="id" key="address" />
        <Column title="技师编号" dataIndex="jid" key="address" />
        <Column title="下单时间" dataIndex="time" key="address" />
      </Table>
    </Space>
  );
};

export default Order;
